<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>银行卡管理</title>  <link rel="icon" href="/template/pc1/images/wmh_favicon.ico" type="image/x-icon" />
    <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" href="/template/pc1/images/wmh_favicon.ico" type="image/x-icon"/>
    <script type="text/javascript" src="/template/default/script/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="/template/default/script/common.js"></script>
    <link type="text/css" rel="stylesheet" href="/template/default/mobile/style/bootstrap.css">
    <script type="text/javascript" src="/template/default/script/bootstrap.js"></script>
    <script type="text/javascript" src="/template/default/script/angular.min.js"></script>
    <link type="text/css" rel="stylesheet" href="/template/default/recouse/css/font-awesome.min.css"/>
    <link type="text/css" rel="stylesheet" href="/template/default/mobile/style/common.mobile.css">
    <link type="text/css" rel="stylesheet" href="/template/default/css/public.css">
    <link type="text/css" rel="stylesheet" href="/template/default/mobile/style/style.css">
    <script type="text/javascript" src="/template/default/mobile/script/jquery.touchwipe.js"></script>
    <script type="text/javascript" src="/template/default/mobile/script/swipe.js"></script>
    <!--弹窗样式-->
    <link rel="stylesheet" type="text/css" href="http://nsr.9hive.cn/global/vendor/layer/mobile/need/layer.css"/>
    <script type="text/javascript" src="http://nsr.9hive.cn/global/vendor/layer/mobile/layer.js"></script>
    <!--<script src="https://static.9hive.cn/global/vendor/layer/layer.js"></script>-->
    <style type='text/css'>
        #poptip {
            position: fixed;
            top: 40%;
            left: 50%;
            width: 160px;
            margin-left: -80px;
            height: 27px;
            background: #000;
            opacity: 0.7;
            filter: alpha(opacity=0.7);
            color: #fff;
            z-index: 999;
            border-radius: 5px;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
        }

        #poptip_content {
            position: fixed;
            top: 40%;
            left: 50%;
            width: 160px;
            margin-left: -80px;
            height: 27px;
            color: #fff;
            text-align: center;
            font-size: 14px;
            z-index: 9909
        }

        select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
            width: 100%;
            margin-bottom: 0;
            box-sizing: border-box;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
        }

        input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
            height: 30px;
        }

        .input-append, .input-prepend {
            width: 100%;
            margin-bottom: 0;
        }

        select {
            padding: 0 5px;
            line-height: 28px;
            -webkit-appearance: button;
        }

        .checkbox.inline {
            margin-top: 0;
        }

        .checkbox.inline + .checkbox.inline {
            margin-left: 0;
        }

        .checkbox input[type="checkbox"] {
            filter: alpha(opacity:0);
            opacity: 0;
        }

        .file {
            position: relative;
        }

        .file input[type="file"] {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            filter: alpha(opacity:0);
            opacity: 0;
        }

        .file button {
            width: 100%;
            text-align: left;
        }

        .form-item {
            border-left: 3px #ED2F2F solid;
            padding-left: 10px;
            height: 30px;
            line-height: 30px;
            background: #F7F7F7;
            margin-bottom: 10px;
        }

        .order-main {
            padding-top: 50px;
        }
    </style>
    <script language='javascript'>
        function toast(msg, autoClose) {
            var div = $("#poptip");
            var content = $("#poptip_content");
            if (div.length <= 0) {
                div = $("<div id='poptip'></div>").appendTo(document.body);
                content = $("<div id='poptip_content'>" + msg + "</div>").appendTo(document.body);
            }
            else {
                content.html(msg);
                content.show();
                div.show();
            }
            if (autoClose) {
                setTimeout(function () {
                    content.fadeOut(500);
                    div.fadeOut(500);

                }, 1000);
            }
        }

        function tip_close() {
            $("#poptip").fadeOut(500);
            $("#poptip_content").fadeOut(500);
        }
    </script>
</head>
<body>

<div class="main">
    <div class="header">
        <div class="h-left">
            <a class="sb-back" href="javascript:history.back(-1)" title="返回"><img src="/template/default/images/arrow_left_white.png"/></a>
        </div>
        <div class="h-mid">
            储蓄卡管理      </div>
    </div>
    <input type="hidden" name="goodstype" value="0"/>
    <div class="order-main">
        <div id="myaddress">
            <%for(list in bank!){%>
            <div id='address_${list.id}' style='margin:0;padding:10px;margin-bottom:10px;cursor:pointer'
                 onclick=selectBank("${returnUrl!}&bankId=${list.id}")><!---->
                <div>
                    开户行：<span style="color: #666">${list.cardCount}</span>
                </div>
                <div>
                    银行卡号：<span style="color: #666">${list.cardNumber}</span>
                </div>
                <!--<span>-->
                <a class="remove_yi" href="javascript:;" onclick="removeBank(event,${list.id})"><img
                        src="/template/default/images/iconfont-xsc.png"/></a>
                <!---->
                <!--</span>-->
            </div>
            <%}%>
        </div>
        <%if(isEmpty(bank)){%>
        <div>
            <button type="button" class="btn btn-danger" onclick="addBank()"><i class="icon-plus"></i> 添加储蓄卡</button>
        </div>
        <%}%>

        <div class="add-address img-rounded" style="display:none;" id="addBankPanel">
            <div class="add-address-hd">请仔细填写收货地址：</div>
            <div class="add-address-main">
                <div class="form-group">
                    <label class="col-sm-3 control-label">持卡人：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control" id="name" placeholder="请输入姓名(请务必与开户行一致)">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">卡号：</label>
                    <div class="col-sm-9">
                        <input type="number" class="form-control" id="cardNumber" placeholder="银行卡号">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">银行名称：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control" id="cardCount" placeholder="银行名称">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">开户行地址：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control" id="cardAddress" placeholder="开户行地址">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">身份证号：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control" id="idNumber" placeholder="身份证号码">
                    </div>
                </div>
                <!--<div class="form-group">
                    <label  class="col-sm-3 control-label">是否默认：</label>
                    <div class="col-sm-6">
                        <select name="isDefault" id="isDefault">
                            <option value="1" selected>是</option>
                            <option value="0">否</option>
                        </select>
                    </div>
                </div>-->
                <input type="hidden" id="addressid" value=""/>
                <div class="form-group">
                    <div class="col-sm-12">
                        <button type="button" class="btn btn-danger" onclick="saveBank()">保存</button>
                        <button type="button" class="btn"
                                onclick="addBank();$('#addBankPanel').hide();$('#addressid').val('');">取消
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="/template/default/recouse/js/zepto.min.js" type="text/javascript"></script>
<script type="text/javascript">
    function get_search_box() {
        try {
            document.getElementById('get_search_box').click();
        } catch (err) {
            document.getElementById('keywordfoot').focus();
        }
    }
</script>


<script type="text/javascript" src="/template/default/recouse/js/cascade.js?x=15"></script>
<script type="text/javascript">
    function toast(msg) {
        layer.open({
            content: msg
            , skin: 'msg',
            anim: 'scale'
            , time: 2 //2秒后自动关闭
        });
    }

    function saveBank() {
        var name = $('#name').val();
        var cardNumber = $('#cardNumber').val();
        var cardCount = $('#cardCount').val();
        var cardAddress = $('#cardAddress').val();
        var idNumber = $('#idNumber').val();
        var cardAddress = $('#cardAddress').val();
        if (!name) {
            toast('请输入持卡人姓名！')
            return false;
        }
        if (!cardNumber) {
            toast('请输入储蓄卡号！');
            return false;
        }
        if (!cardCount) {
            toast('请输入开户行！');
            return false;
        }
        if (!idNumber) {
            toast('请输入身份证号！');
            return false;
        }

        toast("正在处理数据...");
        $.ajax({
            url: "/b/cashingbank/save",
            type: 'post',
            data: {
                "name": name,
                "cardNumber": cardNumber,
                "cardCount": cardCount,
                "cardAddress": cardAddress,
                "idNumber": idNumber,
            },
            success: function (data) {
                if (data.state ==='fail') {
                    //注册错误
                    toast(data.msg);
                } else  {
                    toast('添加成功!');
                    window.location.href = "${returnUrl!}&bankId=" + data.data.bankId + "";

                }
            }
        });
    }

    function addBank() {
        $('#addBankPanel').show();
    }

    function saveDefaultAddress(e, id) {
        toast("正在处理数据...");
        $.post('/b/receiver/setdefault', {
            'id': id,
        }, function (s) {
            tip_close();
            if (s.status) {
                window.location.reload();
            }
        }, 'json');
        e.stopPropagation();
    }

    /*
       $().ready(function () {
           $(document).on('click', '.remove_yi', function () {
               console.log(" ID:  " + $(this).attr('id'))
           })

       })*/

    function removeBank(e, id) {

        e.stopPropagation();
        layer.open({
            content: '您确定要删除吗？'
            , btn: ['是', '否']
            , yes: function (index) {
                toast("正在处理数据...");
                $.ajax({
                    url: "/b/cashingbank/delete",
                    type: 'GET',
                    data: {
                        "id": id,
                        "shopId": "${shopId!}"
                    },
                    success: function (data) {
                        if (data.state=== 'fail') {
                            //注册错误
                            toast(data.msg);
                        } else  {
                            toast('删除成功!');
                            window.location.reload();

                        }
                    }
                });
                layer.close(index)
            }
        })


    }

    var isdef = 0;

    function editAddress(id) {
        if (from == 'confirm') {
            //     location.href = '<!--@php  echo mobile_url('confirm')@-->';
            toast("正在处理数据...");
            $.post('/b/receiver/save', {
                'id': id,
            }, function (s) {
                tip_close();
                if (returnurl != '') {
                    location.href = returnurl;
                    return;
                }
                location.href = '${from}';
            });
            return;
        }

        toast("正在处理数据...");
        $.get('/b/receiver/get', {
            'id': id,
        }, function (s) {
            tip_close();
            if (s) {

                $('#realname').val(s.name);
                $('#mobile').val(s.mobile);
                $('#phone').val(s.phone);
                $('#zipCode').val(s.zipCode);
                $('#sel-provance').val();
                $('#sel-city').val();
                $('#sel-area').val();
                $('#isDefault').val(s.isDefault);

                $('#addBankPanel').show();
                $('#address').val(s.address);
                cascdeInit('/template/default/recouse/js', s.province, s.city, s.area);
                $('#addressid').val(s.id);
            }
        }, 'json');

    }

    function selectBank(url) {
        window.location.href = "" + url;

    }

</script>
